<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="../common/taglibs.jsp" %>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>注册</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <link type="text/css" rel="stylesheet" href="${ctx}/css/unified/unified_sjyx.css">
    <style type="text/css">
        .form{background-color:#404040;}
        /*.form-grp{background-color:#3a3a3a;}*/
        #embed-captcha{height:210px;}
        #embed-captcha .gt_holder{margin:30px 85px;}
        .float_geetest { display: inline-block;  margin-left: 40px;  margin-top: 20px;}
    </style>
</head>
<body>
<div class="page">
    <!--左半部分-->
    <div class="left">
        <div class="left-center">
            <div class="img left_img"></div>
            <p class="left_p">智合数据，以“数据驱动企业发展”为自身使命，致力为全国大中型企业提供一站式产品解决方案。</p>
         
        </div>
    </div>
    <!--右半部分-->
    <div class="right">
        <!--错误提示背景色红-->
        <c:if test="${!empty error}">
            <p class="error-msg-alt">${error}</p>
        </c:if>
        <!--主要内容-->
        <div class="right-center register">
            <!--切换标签-->
            <div class="tab">
                <p class="current" onclick="tabExchange(this,'mobile','email');">通过手机号注册 <span class="img recmd">推荐</span></p>

                <p onclick="tabExchange(this,'email','mobile');">通过邮箱注册</p>
            </div>
            <!--切换内容-->
            <div class="con">
                <form id="mobile-register-form" action="${ctx}/mobile-register" method="post">
                    <input type="hidden" name="redirect_uri" value="${redirect_uri}">
                    <div class="con-item mobile">
                        <div class="form-grp">
                            <span class="form-title"><i>*</i>手机号码:</span>

                            <div class="form-input-grp">
                                <div class="error-out">
                                    <div class="error-msg hide"><span>密码长度不够！</span>&nbsp;&nbsp;
                                        <div class="img error-icon"></div>
                                    </div>
                                </div>
                                <input type="text" id="mobile" placeholder="填写您常用的手机号码作为登录帐号" class="form-input"
                                       name="mobile">
                            </div>
                        </div>

                        <div class="form-grp">
                            <div class="float_geetest" id="float-captcha"></div>
                            <p id="wait" class="show float_geetest">正在加载验证码......</p>
                            <p id="notice" class="hide">请先拖动验证码到相应位置</p>
                        </div>
                        <div class="form-grp">
                            <span class="form-title"><i>*</i>验证码:</span>

                            <div class="form-input-grp">
                                <div class="error-out">
                                    <div class="error-msg hide"><span>密码长度不够！</span>&nbsp;&nbsp;
                                        <div class="img error-icon"></div>
                                    </div>
                                </div>
                                <input type="text" id="yzm" placeholder="将您接收到的验证码填写到这里" class="form-input yzm"
                                       name="captcha">

                                <div class="form-btn form-btn-e yzm-btn" onclick="getPhoneTemp('${ctx}','register');" id="yzm-button">获取验证码</div>
                            </div>
                        </div>
                        <div class="form-btn form-btn-u fd" onclick="findByMobile('${ctx}','register');">下一步</div>
                        <p class="lr-title" onclick="goToLogin();"><i class="img img-rtn-l"></i>&nbsp;已经注册过了？返回登录</p>
                    </div>
                </form>
                    <div class="con-item email hide">
                        <div class="form-grp">
                            <span class="form-title"><i>*</i>邮箱地址:</span>

                            <div class="form-input-grp">
                                <div class="error-out">
                                    <div class="error-msg hide"><span>密码长度不够！</span>&nbsp;&nbsp;
                                        <div class="img error-icon"></div>
                                    </div>
                                </div>
                                <input type="text" id="emailadrs" placeholder="填写您常用的邮箱地址作为登录帐号" class="form-input">
                            </div>
                        </div>
                        <div class="form-btn form-btn-u fd" onclick="findByEmail2('${ctx}');">注册</div>
                        <p class="lr-title" onclick="goToLogin('${ctx}');"><i class="img img-rtn-l"></i>&nbsp;已经注册过了？返回登录
                        </p>
                    </div>
            </div>
        </div>
        <!--发送邮件成功弹出层-->
        <div class="modal send-e-suc">
            <div class="send-email-success">
                <div class="img img-email"></div>
                <p class="email-msg">邮件已经发送</p>

                <p class="email-des">我们已经将注册链接发送到您的邮箱<span id="email-name"></span>中，请打开邮箱中的链接继续完成注册。
                    如长时间未收到激活链接，请检查您的垃圾邮件分类，仍未找到请点击<a onclick="sendAgain(this,'${ctx}','register');">重新发送</a>。</p>

                <p class="lr-title" onclick="hideDialog('send-e-suc');"><i class="img img-rtn-l"></i>&nbsp;填错邮箱地址了？返回重填
                </p>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" src="${ctx}/js/libs/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="${ctx}/js/common/validate.js"></script>
<script type="text/javascript" src="${ctx}/js/unified/unified_sjyx.js"></script>
<script type="text/javascript" src="${ctx}/js/unified/unified_fr.js"></script>
<!-- 引入封装了failback的接口--initGeetest -->
<script type="text/javascript" src="http://static.geetest.com/static/tools/gt.js"></script>
</html>